<template>
  <ContentWrap>
    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
      <el-tab-pane label="关键词库" name="keyword"><Keyword ref="keywordRef" /></el-tab-pane>
      <el-tab-pane label="指纹库" name="fingerprint"
        ><Fingerprint ref="fingerprintRef"
      /></el-tab-pane>
    </el-tabs>
  </ContentWrap>
</template>

<script setup lang="ts">
import Keyword from './keyword.vue'
import Fingerprint from './fingerprint.vue'
import type { TabsPaneContext } from 'element-plus'
defineOptions({ name: 'DevelopFeatureLibrary' })

const activeName = ref('keyword')

const handleClick = (tab: TabsPaneContext, event: Event) => {
  activeName.value == 'keyword' ? keywordRef.value.resetQuery() : fingerprintRef.value.resetQuery()
  console.log(tab, event)
}
const keywordRef = ref()
const fingerprintRef = ref()
</script>

<style lang="scss" scoped></style>
